<template>
	<view class="container">
		<!-- 自定义头部导航栏 -->
		<!-- <headerTitle title="立即开单" left-icon="../../static/nav_back.png" rightText="添加" @clickLeft="clickLeftHeader"  @clickRight="clickRightHeader">
		</headerTitle> -->
		<uni-search-bar style="background-color: #fff;" @confirm="searchConfrim" v-model="queryParmas.Search.NameorCode"
			@cancel="cancel">
		</uni-search-bar>
		<!-- 左侧目录 -->
		<view style="" class="excelBox">
			<!-- 左侧菜单栏可滑动列表数据 -->
			<view class="side-left" style="">
				<scroll-view class="side-left-scroll" scroll-y>
					<TreeFolder :iconName="iconNameChildren" :isShow="isShowChildren" :tree-data="treeData"
						:current="curNameKey" :typeTital="typeTital" @tree-node-click="nodeClick"
						@titleNodeClickChange="titleNodeClickChange" />
				</scroll-view>
			</view>
			<!-- 右侧列表数据 -->
			<view class="side-right">
				<!-- @scrolltolower="scrollBottom" :scroll-top="scrollTop" -->
				<scroll-view class="side-right-scroll" scroll-y lower-threshold="30" scroll-with-animation
					@scrolltolower="getAppInventListdata()">
					<template>
						<uni-list style="margin-bottom: 100rpx;">
							<uni-list-item style="display: flex;" v-for="(item,index) in appInventCartListdata"
								:key="index" @click.stop="handleList(item, index)">
								<template v-slot:body>
									<!-- width: 175rpx;margin-right: 10rpx; display: flex;flex-direction: column;justify-content: space-between;padding: 10rpx 0 10rpx 10rpx; -->
									<view style="width: 100%;">
										<view class="" style="display: flex;">
											<view style="" class="sideRightimage" @click="iInvRCostChange(item,index)">
												<image v-if="item.Picture" :src="item.Picture" alt="" />
												<image v-else src="/static/none.png" mode="" />
											</view>
											<view class=""
												style="display: flex;flex-direction: column;justify-content: space-around;width: 100%;">
												<view class=""
													style="display: flex;flex-direction: column;margin-left: 15rpx;width: 100%;">
													<view v-if="item.cInvName" class="sideRightTitle" style="">
														<text class="slot-box slot-text"
															style="font-size: 28rpx;">{{item.cInvName}}</text>
													</view>
												</view>
												<view class=""
													style="display: flex;flex-direction: column;margin-left: 15rpx;width: 100%;">
													<view v-if="item.cInvCode" class="sideRightTitle" style="">
														<text class="slot-box slot-text"
															style="font-size: 28rpx;">编号:{{item.cInvCode}}</text>
													</view>
												</view>

												<view class="" style="display: flex;margin-left: 15rpx;width: 100%;">
													<view v-if="item.cInvStd" class="sideRightTitle"
														style="margin-right: 15rpx;">
														<text class="slot-box slot-text"
															style="font-size: 28rpx;">规格:{{item.cInvStd}}</text>
													</view>
													<view v-if="item.GroupName" class="sideRightTitle"
														style="margin-left: 10rpx;">
														<text class="slot-box slot-text" style="font-size: 28rpx;">
															单位:{{item.GroupName}}</text>
													</view>
												</view>
											</view>
										</view>

										<view class=""
											style="display: flex;justify-content: space-between;margin-top: 20rpx;">
											<view style="display: flex;flex-direction: column;"
												@click="iInvRCostChange(item,index)">
												<view style="color:red;display: flex;">
													<text
														style="font-size: 0.9rem;">￥</text>{{item.iInvRCost | addZero}}
													<uni-icons type="compose" size="20" color="#999"></uni-icons>
												</view>
											</view>
											<view class="sideRightFooter"
												style=" display: flex;justify-content: flex-end;margin-bottom: 10rpx;">
												<view class="" style="display: flex;">
													<!--  :class="[item.deleteActive==false?'deleteActive':'']" -->
													<text @click="reduce(item,index)">–</text>
													<input :style="{ width: inputWid() }" maxlength="7" type="number"
														v-model="item.number" @focus="numberInputFocus(item)"
														@input="numberInput(item,index, '输入')">
													<!-- :class="[item.number>0?'addActive':'']"git -->
													<text @click="add(item,index, '添加')">+</text>
												</view>
											</view>
										</view>
									</view>
								</template>
							</uni-list-item>
						</uni-list>
						<!-- 上拉显示更多 -->
						<view class="">
							<uniLoadMore :status="status" :contentText="contentText" :rows="appInventCartListdata">
							</uniLoadMore>
						</view>
					</template>
				</scroll-view>
			</view>
		</view>



		<!-- 修改价格弹窗 -->

		<CustomerDrawer ref="CustomerDrawer" :parentObj="this" @focusSearchChange="focusSearchChange"
			@dialogInputConfirm="dialogInputConfirm"></CustomerDrawer>

		<!-- 底部提交区域 -->
		<view class="submitButton" @click="submitButtonAdd">
			<view class="end-left" style="position: relative;">
				<view class="end-left-length">{{totalNum}}
				</view>

				<view class="" style="width: 50px;position: relative;">
					<uni-icons type="cart" size="50" color="#5272EF"></uni-icons>
				</view>

				<view style="width: calc(100% - 50px);">
					<text style="color: #f00;font-weight: bold;font-size: 20px;">
						￥{{totalPrice | addZero}}
					</text>
				</view>
			</view>
			<view class="end-right">
				选好了
			</view>
		</view>
	</view>
</template>

<script>
	import headerTitle from '@/components/header/uni-custom-navbar.vue'
	// 引入修改价格弹窗
	import CustomerDrawer from './customerDrawer.vue'
	// 引入工具函数
	import util from '../../util/util.js'
	import TreeFolder from '../../components/treeFolder.vue'
	// 引入加载更多
	import uniLoadMore from '@/components/uni-load-more.vue'
	import {
		mapMutations
	} from 'vuex'
	const treeData = [{
			id: 1,
			name: "一级1"
		},
		{
			id: 2,
			name: "一级2",
			children: [{
					id: 3,
					name: "二级2-1"
				},
				{
					id: 4,
					name: "二级2-2"
				}
			]
		},
		{
			id: 5,
			name: "一级3",
			children: [{
					id: 6,
					name: "二级3-1",
					children: [{
							id: 7,
							name: "三级3-1-1"
						},
						{
							id: 8,
							name: "三级3-1-2"
						}
					]
				},
				{
					id: 9,
					name: "二级3-2"
				},
				{
					id: 10,
					name: "二级3-3"
				}
			]
		}
	];
	export default {
		components: {
			// 自定义顶部导航栏头部
			headerTitle,
			// 注册递归组件
			TreeFolder,
			// 加载更多
			uniLoadMore,
			// 修改价格弹窗
			CustomerDrawer

		},
		data() {
			return {
				customerList: [],
				CustomerId: "",
				popupKewords: "",
				// 修改价格是否选中 如果列表中的商品价格=0或空，此checkbox默认选中;如果列表中的商品价格>0，此checkbox不选中，但可以自由选中
				isCheckedBox: false,
				// 总价格
				totalPrice: 0,
				// 总数量
				totalNum: 0,
				// 加载状态
				status: "loading",
				contentText: {
					contentdown: '',
					contentrefresh: '加载中',
					contentnomore: '没有更多了'
				},
				// 是否禁止减号
				deleteActive: true,
				// 修改价格的存储数据
				inputVlaueKeywords: "",
				// 修改的产品参数
				objectEdit: {

				},
				index: null,
				scrollviewHeight: "",
				// 购物车图片
				image: '/static/cart.png',
				// 是否全选
				allchecked: true,
				// 是否选中
				checked: true,
				scrollTop: 10,
				scrollBottom: 10,
				typeTital: 2,
				curNameKey: '',
				//  显示子组件里的向上或者向下箭头
				iconNameChildren: "top",
				// 是否显示子组件的下级目录
				isShowChildren: false,
				// 左侧目录数据
				// 报表文件递归组件数据
				treeData: treeData,
				// 传递参数
				queryParmas: {
					// 当前页
					PageIndex: 1,
					// 每页多少条
					PageRows: 10,
					// 排序
					SortField: 'Id',
					SortType: 'dsc',
					// 搜索参数
					Search: {
						NameorCode: "",
						Condition: "Name",
						// 公司id  后续取公共参数  登录后获取的用户信息
						CommpayId: uni.getStorageSync('CompanyInfo') ? (uni.getStorageSync('CompanyInfo')).Id : "",
					}
				},
				// 总条数
				Total: 0,
				CommpayId: '',
				// 右侧列表数据
				appInventCartListdata: [],
				// 选中后饿购物车列表
				selectCartListData: [],

				newTotalPrice: 0

			}
		},
		onLoad() {
			this.CommpayId = uni.getStorageSync('CompanyInfo') ? (uni.getStorageSync('CompanyInfo')).Id : "";
			this.isShowChildren = true
			// 获取分类数据
			// this.inventTypeGetDataList()
			// 获取右侧产品列表数据
			// this.getAppInventListdata()

			// uni.getSystemInfo({
			// 	success: (res) => {
			// 		// 获取手机状态栏高度
			// 		console.log('获取手机状态兰高度',res.statusBarHeight)
			// 		// this.statusBarHeight = res.statusBarHeight;
			// 		// this.scrollviewHeight = `calc(100vh - 580rpx - ${this.statusBarHeight}rpx)`;
			// 	}
			// });

		},
		onShow() {
			// 获取购物车列表
			// this.submitButtonAdd()
			if (this.$store.state.cartListData.length == 0) {
				this.selectCartListData = this.$store.state.cartListData

			}
			this.queryParmas.PageIndex = 1
			// 获取分类数据
			this.inventTypeGetDataList()
			// 判断缓存中是否存在购物车列表数据。存在获取 渲染  
			this.getOnShowCartListData()
			// 每次显示页面的时候 都更新总价格和总数量   根据vuex 中的购物车数据进行渲染
			this.allPrice()
			this.allNum()

		},
		// 格式化千分位 保留两位小数 过滤器
		filters: {
			addZero: function(data) {
				if (!data) {
					return '0.00'
				}
				return util.toThousands(data)
			}
		},
		computed: {
			// input输入框宽度自适应
			inputWid() {
				return function(value) {
					// console.log('获取实时监听输入的饿值', value)
					if (value == '' || value == 0) {
						return '50rpx';
					} else {
						return String(value).length * 17 + 'rpx';
					}
				};
			},
		},
		// 下拉刷新
		onPullDownRefresh() {
			// 重置相关参数
			this.status = "loading"
			this.appInventCartListdata = []
			this.queryParmas.PageIndex = 1
			this.queryParmas.PageRows = 10
			this.getAppInventListdata()
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 2000)
		},
		onNavigationBarButtonTap() {
			uni.navigateTo({
				url: '/pages/Information/page/GoodsInfo/GoodsInfo'
			})
		},
		// 监听原生导航栏返回事件
		onBackPress(e) {
			if (this.selectCartListData.filter(item => item.number > 0).length > 0) {
				uni.showModal({
					title: '提示',
					content: '返回会清空订单数据, 是否确认返回?',
					success: (val) => {
						if (val.confirm) {
							this.setCartListData([])
							uni.switchTab({
								url: '/pages/index/index'
							})
						}
					},
				})
				return true
			}
			this.setCartListData([])
		},

		// 上拉加载更多
		onReachBottom() {
			// this.getAppInventListdata()
		},
		methods: {
			...mapMutations(['setCartListData']),
			// 顶部导航栏左侧返回事件
			clickLeftHeader() {
				// this.$store.commit('setCartListData',[])
				var that = this
				let vuexCartListData = this.$store.state.cartListData
				let isHave = null
				vuexCartListData.forEach(item => {
					if (item) {
						if (item.flag == true && item.number != "") {
							isHave = true
						} else {
							isHave = false
						}
					}
				})


				if (vuexCartListData.length > 0 && isHave == true) {
					uni.showModal({
						title: '温馨提示', //提示标题
						content: '您已有订单, 返回会清空订单数据, 是否确认返回?', //提示内容
						showCancel: true, //是否显示取消按钮
						success: function(res) {
							if (res.confirm) { //confirm为ture，代表用户点击确定
								// 如果点击了确定按钮 说明强制返回  清空vuex数据
								that.$store.commit('setCartListData', [])
								// 返回到上一页
								uni.navigateBack({})
							} else if (res.cancel) { //cancel为ture，代表用户点击取消
							}
						}
					})
				} else {
					uni.navigateBack({})
				}
			},

			// 顶部导航栏右侧添加商品事件
			clickRightHeader() {
				uni.navigateTo({
					url: '/pages/Information/page/GoodsInfo/GoodsInfo'
				})
			},

			// 赋值子组件里的选择好的客户名称
			setPopupKewords(name) {
				this.$refs.CustomerDrawer.popupKewords = name

			},

			// 获取选择客户后的价格历史记录数据
			getHistoricalDetail() {
				this.$http('post', '/BO/BIlling/GetHistoricalDetail?CustomerId=' + this.CustomerId + '&InventId=' + this
						.objectEdit.Id)
					.then(res => {
						if (res.Success) {
							res.Data.forEach(item => {
								item.CreateTime = util.formatDate('format', item.CreateTime)
								// 金额保留两位小鼠
								item.Price = util.toThousands(item.Price)
							})
							this.customerList = res.Data
							// 调用子组件里的方法赋值 价格历史记录
							this.$refs.CustomerDrawer.setCustomerList(this.customerList)
						} else {
							this.customerList = []
						}
					})

			},


			getOnShowCartListData() {
				// this.$store.commit('setCartListData', [])
				let onShowCartListData = uni.getStorageSync('cartListData')
				if (onShowCartListData.length !== 0) {
					// 说明购物车中有数据  
					this.selectCartListData = onShowCartListData
				}

				// 更新总价格和总数量
				this.allPrice()
				this.allNum()

			},


			// 搜索
			searchConfrim() {
				this.status = "loading"
				// 搜索重置话参数
				this.queryParmas.PageIndex = 1;
				this.queryParmas.PageRows = 10;
				this.appInventCartListdata = []
				this.getAppInventListdata('search');
			},

			// 商品价格修改
			iInvRCostChange(item, index) {
				this.objectEdit = item
				this.index = index
				// 将当前选中好的修改价格的商品价格 更新子组件输入框
				this.$refs.CustomerDrawer.placeholder = util.toThousands(item.iInvRCost)
				// 如果列表中的商品价格=0或空，此checkbox默认选中;如果列表中的商品价格>0，此checkbox不选中，但可以自由选中
				if (item.iInvRCost == 0) {
					// 设置子组件里的是否选中
					this.$refs.CustomerDrawer.isCheckedBox = true
				} else {
					this.$refs.CustomerDrawer.isCheckedBox = false
				}
				// 清空上一次输入后的值
				this.$refs.CustomerDrawer.inputVlaueKeywords = ""
				// 修改价格弹窗
				this.$refs.CustomerDrawer.openForm(item.Id)
				this.getHistoricalDetail()

			},


			// 选择客户输入框点击事件
			focusSearchChange(event) {
				uni.navigateTo({
					url: "/pages/Information/page/Customer?" + event + '=true'
				})
			},


			getOnShowCartListData() {
				// this.$store.commit('setCartListData', [])
				let onShowCartListData = uni.getStorageSync('cartListData')
				if (onShowCartListData.length !== 0) {
					// 说明购物车中有数据  
					this.selectCartListData = onShowCartListData
				}

				// 更新总价格和总数量
				this.allPrice()
				this.allNum()

			},


			// 搜索
			searchConfrim() {
				this.status = "loading"
				// 搜索重置话参数
				this.queryParmas.PageIndex = 1;
				this.queryParmas.PageRows = 10;
				this.appInventCartListdata = []
				this.getAppInventListdata('search');
			},



			// 修改价格弹窗确定事件
			dialogInputConfirm(inputVlaueKeywords) {
				//如果购物车里的商品id = 点击数据商品id 则返回此元素下标
				let newIndex = this.selectCartListData.findIndex(ev => ev.Id === this.objectEdit.Id)

				if (newIndex == -1) {
					// 说明没有查询出来  更新购物车中的修改价格数据
					// 将修改后的价格赋值 
					this.objectEdit.editPrice = Number(inputVlaueKeywords)
					this.appInventCartListdata.forEach(item => {
						if (item.Id === this.objectEdit.Id) {
							// 说明当前修改的对象数据相同
							item.iInvRCost = Number(inputVlaueKeywords)
						}
					})
					// this.appInventCartListdata[newIndex].iInvRCost = this.inputVlaueKeywords
					if (this.objectEdit.number !== "") {
						// 说明是在有输入数量的条件下修改的价格。此条件下 就需要加入购物车  否则 如果在没有输入价格的条件下修改的价格 不需要加入购物车
						this.selectCartListData.push(this.objectEdit) //把商品追加进购物车	
					}



				} else {
					// 如果当前修改的数据已经存在。。更新当前条的价格即可
					this.selectCartListData[newIndex].iInvRCost = Number(inputVlaueKeywords)
					this.selectCartListData[newIndex].editPrice = Number(inputVlaueKeywords)
					// 将修改后的价格赋值
					this.objectEdit.editPrice = Number(this.inputVlaueKeywords)
					this.appInventCartListdata.forEach(item => {
						if (item.Id === this.objectEdit.Id) {
							// 说明当前修改的对象数据相同
							item.iInvRCost = Number(inputVlaueKeywords)
							item.editPrice = Number(inputVlaueKeywords)
						}
					})
				}


				// 存储购物车数据
				this.$store.commit('setCartListData', this.selectCartListData)


				// 判断子组件里的isCheckbox是否选中来调用是否真实更新商品价格
				if (this.$refs.CustomerDrawer.isCheckedBox == true) {
					let obj = {
						// 当前要修改的产品的id
						Id: this.objectEdit.Id,
						// 当前产品修改后的价格
						iInvRCost: Number(inputVlaueKeywords)
					}
					// 如果多选框里勾选了  调用接口   否则不调用
					this.isCheckedRequest(obj)
				}

				// 更新总价格和总数量
				this.allPrice()
				this.allNum()

				// 关闭弹窗
				this.$refs.CustomerDrawer.closeDrawer()

			},

			isCheckedRequest(obj) {
				this.$http('post', '/BO/Inventory/updateInvRCost?Id=' + obj.Id + '&iInvRCost=' + obj.iInvRCost)
					.then(res => {
						if (res.Success) {
							this.$api.msg('已修改')
							// 停止加载状态
							uni.hideLoading();
						} else {
							this.$api.msg(res.Msg)
						}
					})
			},


			// 数量输入事件
			numberInput(item, index, title) {
				console.log(item)
				if (Number(item.number) < 0) {
					setTimeout(() => {
						item.number = ''
					})
					return this.$api.msg('不能为负数')
				}
				if (item.number.length == 7) {
					// 保存百万级
					this.$api.msg('只能输入到百万')
					// item.number = Number(number)
					return
				}
				//如果购物车里的商品id = 点击数据商品id 则返回此元素下标
				let newIndex = this.selectCartListData.findIndex(ev => ev.Id === item.Id)
				if (newIndex == -1) {
					// 说明购物车中不存在当前这个数组对象  往数组里push
					// 设置选中商品
					item.flag = true
					// item.number = 1  //添加数量属性number ，默认为 为空【原数据没有数量字段】	
					this.selectCartListData.push(item) //把商品追加进购物车		
				} else {
					item.flag = true
					this.selectCartListData.forEach(v => {
						if (v.Id === item.Id && v.number === "") {
							// 说明清空了当前数据了  所以删除购物车对应数据
							this.selectCartListData.splice(newIndex, 1)

						}
						// 此代码是用于输入数量后，切换左侧导航栏  后再回来   删除减号后  总价格始终保持负数的问题
						if (v.Id === item.Id) {
							v.number = item.number
						}
					})

				}
				// 判断number是有有值  判断当前个商品是否输入 再插入购物车 避免没有输入价格后，只是修改了价格，也插入购物车导致购物车列表数据有问题
				if (item.number === "") this.selectCartListData.splice(newIndex, 1)
				// 存储vuex已经选好的购物车数据
				this.$store.commit('setCartListData', this.selectCartListData)

				// 更新总价格和总数量
				this.allPrice()
				this.allNum()

			},
			numberInputFocus(item) {
				// console.log('获取焦点', item.number)
			},
			// 子组件传递事件
			nodeClick(val) {
				// 加载状态
				this.status = "loading"
				this.curNameKey = val.Id;
				this.$set(val, "curNameKey", this.curNameKey);
				// 调用子组件的获取数据方法重新加载数据
				this.titleNodeClickChange(val)

			},
			// 子组件的全部点击事件
			titleNodeClickChange(item) {
				this.curNameKey = item.Id
				this.isShowChildren = true
				this.queryParmas.PageIndex = 1
				this.queryParmas.PageRows = 10
				this.queryParmas.Search.NameorCode = ""

				this.appInventCartListdata = []
				this.getAppInventListdata()

			},

			// 购物车列表选择  暂时不删除  
			// selected(item) {
			// 	item.flag = !item.flag
			// 	if (!item.flag) {
			// 		this.allchecked = false
			// 	} else {
			// 		const test = this.appInventCartListdata.every(item => {
			// 			return item.flag === true
			// 		})
			// 		if (test) {
			// 			this.allchecked = true
			// 		} else {
			// 			this.allchecked = false
			// 		}
			// 	}
			// 	// this.checked=!this.checked
			// 	// this.totalNum()
			// },

			// 计算商品总价格

			//添加
			add(item, index, title) {
				if (Number(item.number) > 9999999) {
					return this.$api.msg('已到最大值')
				}
				//如果购物车里的商品id = 点击数据商品id 则返回此元素下标
				let newIndex = this.selectCartListData.findIndex(ev => ev.Id === item.Id)

				//如果购物车不存在相同的商品
				if (newIndex === -1) {

					item.flag = true
					item.number = 1 //添加数量属性num ，默认为 为空【原数据没有数量字段】	
					this.selectCartListData.push(item) //把商品追加进购物车		
				} else {
					if (item.number == -1) {
						// 重置没有选中
						item.flag = false
						item.number = ""
						// 说明当前已经增加到0了 清空购物车的数组
						this.selectCartListData.splice(newIndex, 1)
					} else {
						item.flag = true
						this.selectCartListData[newIndex].number = Number(this.selectCartListData[newIndex].number) +
							1 //存在相同的商品则数量叠加
					}
				}

				// 此代码是为了解决当值修改价格后。没有选中该商品的时候  设置是否选中 。以此来校验返回逻辑
				this.selectCartListData.forEach(m => {
					if (m.number != "") {
						m.flag = true
					} else {
						m.flag = false
					}
				})


				// 存储vuex已经选好的购物车数据
				this.$store.commit('setCartListData', this.selectCartListData)



				let storeCartListData = this.$store.state.cartListData
				this.appInventCartListdata.forEach(v => {
					storeCartListData.forEach(m => {
						if (v.Id === m.Id) {
							v.number = m.number
							v.flag = m.flag
						}
					})
				})


				this.status = "noMore"
				// 重新调用下接口。重新渲染增加后或者减少后的数量值。  否则数量视图不更新
				// this.getAppInventListdata() 暂时不删除  后续有问题这块再次打开尝试
				// 更新总价格和总数量
				this.allPrice()
				this.allNum()


			},
			allPrice() {
				let totalPrice = 0;

				this.selectCartListData.map(item => {
					totalPrice += item.number * item.iInvRCost
				})

				this.totalPrice = totalPrice
			},
			// 计算商品总数量
			allNum() {
				let totalNum = 0;
				if (this.selectCartListData.length <= 0) return this.totalNum = 0
				this.selectCartListData.map(item => {
					if (item.number < 0) {
						totalNum -= Number(item.number)
					} else {
						// 计算总数量
						totalNum += Number(item.number)
					}

				})
				this.totalNum = parseInt(totalNum)
			},
			// 减少
			reduce(item, index) {
				console.log(item, index)
				if (Number(item.number) <= 0) {
					item.number = ''
					return this.$api.msg('已最低不能再减少')
				}
				//如果购物车里的商品id = 点击数据商品id 则返回此元素下标
				let newIndex = this.selectCartListData.findIndex(ev => ev.Id === item.Id)
				//如果购物车不存在相同的商品
				if (newIndex === -1) {
					item.flag = true
					item.number = -1 //添加数量属性num ，默认为 为空【原数据没有数量字段】	
					this.selectCartListData.push(item) //把商品追加进购物车					
				} else {
					if (item.number == 1) {
						// 重置没有选中
						item.flag = false
						// 重置number
						item.number = ""
						// 此时说明当前已经减到0了  删除购物车的数组
						this.selectCartListData.splice(index, 1) //从数组中删除
					} else {
						item.flag = true
						this.selectCartListData[newIndex].number = Number(this.selectCartListData[newIndex].number) -
							1 //存在相同的商品则数量叠加
					}

				}

				// 存储vuex已经选好的购物车数据
				this.$store.commit('setCartListData', this.selectCartListData)


				let storeCartListData = this.$store.state.cartListData
				this.appInventCartListdata.forEach(v => {
					storeCartListData.forEach(m => {
						if (v.Id === m.Id) {
							v.number = m.number
							v.flag = m.flag
						}
					})
				})
				// 重新调用下接口。重新渲染增加后或者减少后的数量值。  否则数量视图不更新
				// this.getAppInventListdata()   暂时不删除  后续有问题这块再次打开尝试
				// 更新总价格和总数量
				this.allPrice()
				this.allNum()
			},

			// 选好了
			async submitButtonAdd() {
				if (this.totalNum == 0) {
					// 没有选择商品
					this.$api.msg('请选择商品')
					return
				}

				let cartListParams = []


				let paramsSelectCartListData = this.selectCartListData
				paramsSelectCartListData.forEach(item => {

					// 价格
					item.Price = item.iInvRCost
					// 价格
					item.iInvRCost = item.iInvRCost
					// 总钱数 回执单的总额
					item.SumiInvRCost = item.number * item.iInvRCost
					// 产品的名字
					item.Name = item.cInvName
					// 产品的重量
					item.Weight = item.Weight == null ? 0 : item.Weight
					// 当前选择的产品数量
					item.Quantity = item.number
					// 商品包装规格
					item.cInvStd = item.cInvStd
					// 产品id
					item.InventId = item.Id
					// 公司id
					item.CommpayId = this.CommpayId
					// 商品编号
					item.cInvCode = item.cInvCode
					// 总钱数
					item.Money = item.number * item.iInvRCost
				})


				// this.$store.commit('setCartListData', paramsSelectCartListData)
				// 加入购物车
				await this.$http('post', '/BO/ShoppingCart/AddCartList?CommpayId=' + this.CommpayId,
						paramsSelectCartListData)
					.then(res => {
						if (res.Success) {
							this.$api.msg('已选好')
							// 停止加载状态
							uni.hideLoading();
						} else {}
					})
				uni.navigateTo({
					url: '/pages/orderDetail/orderDetail'
				})
				uni.showLoading({
					title: '加载中...'
				});
			},

			// 获取分类数据
			inventTypeGetDataList() {

				let queryParmas = {
					Search: {
						// 公司id  后续取公共参数  登录后获取的用户信息
						CommpayId: uni.getStorageSync('CompanyInfo') ? (uni.getStorageSync('CompanyInfo')).Id : "",
					}
				}
				this.$http('post', '/BO/InventType/GetDataList', queryParmas).then(res => {
					if (res.Success) {

						let obj = {
							CompanyId: null,
							CreateTime: null,
							CreatorId: null,
							Deleted: null,
							Icon: null,
							Id: "0",
							IndustryName: null,
							Name: "全部",
							ParentId: null
						}
						res.Data.unshift(obj)
						this.treeData = res.Data
						this.curNameKey = res.Data[0].Id
						this.$set(this.queryParmas.Search, 'TypeId', res.Data[0].Id)
						// 获取右侧商品列表数据
						this.getAppInventListdata()
					} else {
						uni.showToast({
							title: res.Msg
						})
						// 停止架子状态
						uni.hideLoading();
					}

				})
			},

			// 搜索框取消
			cancel() {
				this.queryParmas.Search.NameorCode = ''
				this.queryParmas.PageIndex = 1
				this.queryParmas.PageRows = 10
				this.appInventCartListdata = []
				this.getAppInventListdata()
			},

			// 获取右侧产品列表数据
			getAppInventListdata(params) {

				// 加载状态
				// this.status = "loading"
				if (params === "search") {
					// 说明是从搜索过来的 清空typeId
					this.$set(this.queryParmas.Search, 'TypeId', "")
				} else {
					this.$set(this.queryParmas.Search, 'TypeId', this.curNameKey)
				}
				this.$http('post', '/BO/BIlling/GetAppInventdata', this.queryParmas).then(res => {
					if (res.Success) {
						uni.hideLoading()
						let lists = res.Data
						// 赋值总条数
						// this.Total = res.Total
						if (res.Data.length == 0) {
							// 没有更多了
							this.status = "noMore"
						}
						if (lists.length == 0 && lists == []) {
							// 没有更多了
							this.status = "noMore"
						} else {

							if (this.queryParmas.PageIndex == 1) {
								this.appInventCartListdata = lists
								this.queryParmas.PageIndex += 1

								this.appInventCartListdata.forEach(item => {
									// 记录是否选中了当前商品
									this.$set(item, 'flag', false);
									// 记录选中当前商品的数量
									this.$set(item, 'number', "");
									// 记录当前选择的商品总价格
									this.$set(item, 'totalPrice', 0);
									this.$set(item, 'newTotalPrice', 0);
									// 修改的数量
									this.$set(item, 'editPrice', 0);
								})

								let newTotalPrice = 0
								let newData = this.$store.state.cartListData
								this.appInventCartListdata.forEach(item => {
									newData.forEach(v => {
										if (v.Id == item.Id) {
											// 过滤当前修改价格的id 是否等于原来数据的id 对应修改价格
											item.editPrice = v.editPrice
											item.iInvRCost = v.iInvRCost
										}
										if (v.flag == true && v.Id == item.Id) {
											item.number = v.number
											item.flag = v.flag
											newTotalPrice += v.number * v.iInvRCost

										}
									})
								})


								// 没有更多了
								this.status = "noMore"
								// console.log('获取最终即将渲染的数据刚刚第一页刚刚第一页', this.appInventCartListdata, this.$store.state
								// 	.cartListData)
							} else {
								// if (this.queryParmas.PageRows * this.queryParmas.PageIndex > this.Total) {
								// 	// 暂停加载  没有更多了
								// 	this.status = "noMore"
								// 	return
								// }
								if (this.appInventCartListdata.length >= this.Total) return

								let newTotalPrice = 0
								let newData = this.$store.state.cartListData
								this.appInventCartListdata = this.appInventCartListdata.concat(lists)
								this.appInventCartListdata.forEach(item => {
									newData.forEach(v => {
										if (v.Id == item.Id) {
											// 过滤当前修改价格的id 是否等于原来数据的id 对应修改价格
											item.editPrice = v.editPrice
											item.iInvRCost = v.iInvRCost
										}

										if (v.flag == true && v.Id == item.Id) {
											item.number = v.number
											item.flag = v.flag
											item.editPrice = v.editPrice
											item.iInvRCost = v.iInvRCost
											newTotalPrice += v.number * v.iInvRCost

										}
									})
								})
								this.queryParmas.PageIndex += 1
								this.status = "noMore"
								// console.log('获取最终即将渲染的数据上拉加载上拉加载', this.appInventCartListdata, this.$store.state
								// 	.cartListData)
							}


						}
						uni.stopPullDownRefresh(); //停止刷新
						// 赋值总条数
						this.Total = res.Total
					} else {
						// uni.showToast({
						// 	title: res.Msg
						// })
						// 停止架子状态
						uni.hideLoading();
						this.status = "noMore"
					}

				})
			}
		}
	}
</script>

<style>
	.deleteActive {
		background-color: #A7A7A7 !important;
		opacity: 0.3;
		color: #333;
	}

	.addActive {
		background-color: #627EFC !important;
		color: #fff !important;
	}

	.container {
		height: 100%;
	}

	.excelBox {
		height: 100%;
		overflow: hidden;
		display: flex;
		width: 100%;
		/* height: 200px;
		overflow: auto;
		padding: 10px;
		margin: 10px; */
	}

	.side-left {
		background-color: #E8F4FF;
		width: 23%;
		height: 100%;
		flex-shrink: 0;
		padding-bottom: 100rpx;
	}

	.side-right {
		background-color: #fff;
		width: 77%;
		height: 100%;
		flex-shrink: 0;
	}

	.side-left-scroll {
		height: 100%;
	}

	.side-right-scroll {
		width: 99%;
		height: 100%;
	}

	.sideRightTitle {
		display: flex;
		flex-direction: column;
	}

	.sideRightimage image {
		width: 150rpx;
		height: 150rpx;
		border-radius: 15rpx
	}

	.sideRightFooter {
		display: flex;
		align-items: center;
	}

	.sideRightFooter input {
		text-align: center;
		width: 80rpx;
		backzound-color: #F7F7F7;
		margin-right: 10rpx;
		padding: 2rpx 0;
	}

	.sideRightFooter text {
		width: 50rpx;
		line-height: 50rpx;
		text-align: center;
		display: inline-block;
		background-color: #F7F7F7;
		margin-right: 10rpx;

	}

	.submitButton {
		width: 100%;
		height: 90rpx;
		position: fixed;
		/* bottom: 100rpx; */
		bottom: 0;
		height: 200rpx;
		/*暂时发现安卓小屏手机安全区为0 && 不带单位的话padding-bottom会失效，写一个兜底, 并写在最上面；f12发现css样式如果都给height设置样式，会依次往下，用最底下的一个样式，如果最下面的没失效，依次往上查找，所以兜底的写在最上面 */
		height: calc(150rpx + constant(safe-area-inset-bottom));
		/* 直接扩展高度，因为padding-bottom是内边距 */
		height: calc(150rpx + env(safe-area-inset-bottom));
		/* 直接扩展高度 */
		padding-top: 10rpx;
		padding-left: 20rpx;
		padding-right: 20rpx;
		box-sizing: border-box;
		padding-bottom: constant(safe-area-inset-bottom);
		/*兼容 iOS<11.2 */
		padding-bottom: env(safe-area-inset-bottom);
		/* 兼容iOS>= 11.2*/
		left: 0;
		display: flex;
		align-items: center;
		background-color: #fff;
	}

	.submitButton .end-left {
		width: 80%;

		display: flex;
		justify-content: space-between;
		align-items: center;
		/* padding: 0 30rpx; */
	}

	.submitButton .end-left .end-left-length {
		/* 宽度自适应 */
		display: inline-block;

		position: absolute;
		top: -20px;
		left: 0;
		background-color: #FA6703;
		border-radius: 50%;
		text-align: center;
		border: 1px solid #FF98FF;
		padding: 0 15rpx;
		z-index: 1;
		/* margin-left: 60rpx; */
		color: #fff;

	}

	.submitButton .end-right {
		width: 20%;
		/* width: 150px; */
		line-height: 90rpx;
		background-color: #5272EF;
		text-align: center;
		color: #fff;
		border-top-right-radius: 50rpx;
		border-bottom-right-radius: 50rpx;
	}

	.my-index-userpop-box {
		width: 500rpx;
		box-sizing: border-box;
		background: #fff;
		border-radius: 17rpx;
		margin: 0 auto;
	}

	.my-index-userpop-box .title {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
	}

	.my-index-userpop-box .title>text:nth-child(1) {
		font-size: 35rpx;
		font-weight: bold;
		color: #888;
	}

	.my-index-userpop-box .title>text:nth-child(2) {
		font-size: 21rpx;
		color: #E0E0E0;
	}

	.input {
		border: 1px solid #999;
		border-radius: 10rpx;
		padding: 20rpx;
		margin: 20rpx 0;
	}

	.input::placeholder {
		font-size: 25rpx;
	}

	.cancel {
		color: #8E8E8B;
		border: 1px solid #8E8E8B;
		border-radius: 10rpx;
		padding: 15rpx 60rpx;
	}

	.confirm {
		background-color: #5272EF;
		border-radius: 10rpx;
		padding: 15rpx 60rpx;
		color: #fff;
	}
</style>